<template>
<div>
  <header>
    <span>处理状态：</span>
    <Select v-model="queryData.actionType" style="width:200px">
      <Option v-for="item in actionType" :value="item.id" :key="item.id">{{ item.type }}</Option>
    </Select>
    <span>违规类型：</span>
    <Select v-model="queryData.violateType" style="width:200px">
      <Option v-for="item in violateType" :value="item.udvtypeId" :key="item.udvtypeId">{{ item.udvtypeName }}</Option>
    </Select>
    <span>工号查询:</span>
    <Input v-model="queryData.account" placeholder="请输入工号名称" style="width: 200px"/>
    <Button type="primary" @click="query">查询</Button>
    <Button @click="reset" class="reset">重置</Button>
  </header>
  <div>
    <Table stripe :columns="columns1" :data="data1">
      <template slot-scope="{ row }" slot="name">
        <strong>{{ row.name }}</strong>
      </template>
      <template slot="action" slot-scope="{ row, index }">
        <Button type="success" @click="detail(index)" size="small">查看详情</Button>
        <Button type="primary" @click="send(index)" size="small">提交反馈</Button>
      </template>
    </Table>
  </div>
  <div style="margin: 10px;overflow: hidden">
    <div style="float: right;">
      <Page :total="100" :current="queryData.currentPage" @on-change="changePage"  @on-page-size-change="changeSize" show-elevator show-sizer></Page>
    </div>
  </div>
  <Modal
    v-model="modal1"
    title="违规图片"
    @on-ok="ok"
    ok-text="撤销该违规记录"
    @cancel="reback"
    cancel-text="返回"
    width="650"
  >
    <img :src="imgSrc" width="600px">
  </Modal>
  <Modal
    v-model="modal2"
    title="提交反馈"
    @on-ok="submit"
    ok-text="发送"
    @cancel="reback"
    cancel-text="取消"
  >
    <span>  反馈信息：</span>
    <textarea v-model="text"></textarea>
  </Modal>
</div>
</template>

<script src="./complaint-component.js">
</script>

<style scoped>

</style>
